<!DOCTYPE html>
<html lang="en">
	<head>
		<meta charset="UTF-8">
		<meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,initial-scale=1.0,width=device-width" />
		<meta name="format-detection" content="telephone=no,email=no,date=no,address=no">
		<link rel="stylesheet" href="../../css/animate.css">
		<link rel="stylesheet" href="../../iconfont/iconfont.css">
		<link rel="stylesheet" href="../../css/mescroll.css">
		<link rel="stylesheet" href="../../css/gloab.css">
		<title>修改账户信息</title>
		<style>
			.none-order{
      text-align: center;
      color:#727272;
      line-height: 200%;
      margin-top: 1rem;
    }
    .mescroll{
      position: fixed;
      top: 0;
      bottom: 0;
      height: auto; /*如设置bottom:50px,则需height:auto才能生效*/
    }
    .zz-img{
      width:2.5rem;
      margin:0 auto;
      background:#eee;
      height:2.5rem;
      padding:auto;
      border:1px solid #dedede;
      border-radius:0.05rem;
    }
    .zz-img img{
      width:1rem;
      margin-left:0.75rem;
      margin-top:0.3rem;
    }
    .zz-img div{
      text-align:center;
      line-height:0.45rem;
      height:0.45rem;
      margin-top:0.35rem;
      font-size:0.3rem;
      color:#999;
    }
    .zz-content{
      width:90%;
      height:0.45rem;
      line-height:0.45rem;
      text-align:center;
      margin:0.25rem auto;
      font-size:0.25rem;
      color:#999;
    }
    .zz-image{
      width:2.65rem;
      height:2.65rem;
      margin:auto;
      background: #eee;
      border-radius: 50%;
      overflow: hidden;
    }
    .zz-image img{
      width:100%;
      height: 100%;
    }
    .zz-images{
      width:85%;
      height:3rem;
      margin:0.2rem auto;
      background: #eee;
      /*overflow: hidden;*/
    }
    .zz-img-button-list{
      width:85%;
      height:1rem;
      margin:auto;
      line-height: 1rem;
    }
    .zz-img-button-list div{
      width:30%;
      float: left;
      font-size: 0.3rem;
    }
    .zz-img-button-list img{
      width:20%;
      line-height: 1rem;
      margin-top: 0rem;
      padding-top:0.2rem;
    }
    .zz-img-button-list span{
      margin-top: 0rem;
      font-size: 0.3rem;
    }
    .zz-images img{
      width:100%;
      height: 100%;
    }
    .zz-title{
      width:85%;
      height:0.45rem;
      line-height: 0.45rem;
      margin:0.25rem auto;
      font-size: 0.3rem;
    }
    .zz-title input{
      height:0.45rem;
      line-height: 0.45rem;
      font-size: 0.3rem;
    }
    .zz-button{
      width:50%;
      height:0.65rem;
      text-align: center;
      background: #3b8bff;
      line-height: 0.65rem;
      margin:1rem auto;
      color:#fff;
      border-radius: 0.08rem;
    }
    .product-content{
      width: 100%;
      background: #e4e4e4;
      padding:0.1rem 0;
    }
  </style>
	</head>
	<body>
		<div id="app">
			<div id="public-header">
				<div id="statusbar"></div>
				<header class="public-header">
					<div class="public-header-lf iconfont icon-fanhui" @click="javascript:api.closeWin();"></div>
					<div class="public-header-title">修改账户信息
					</div>
					<!-- <div class="public-header-text" @click="javascript:api.openWin({name: 'fahongbao',reload:true,url:'../home/fabu.html',});">我要发红包</div> -->
				</header>
			</div>
			<div class="dating-body auto" style="padding-bottom:0.5rem;margin-top:0.5rem;">
				<div class="zz-title" style="width:100%;margin-left:8%;">
				</div>
				<!-- <div class="zz-title" v-else>
        当前账户姓名：未添加
      </div>
      <div class="zz-title" style="border-bottom:1px solid #999;padding-bottom:0.15rem;">
        <input type="text" v-model="name" placeholder="请输入真实姓名">
      </div> -->
				<div class="zz-title" v-if="names">
					当前姓名：{{names}}
				</div>
				<div class="zz-title" v-else>
					当前姓名：未添加
				</div>
				<div class="zz-title" style="border-bottom:1px solid #ccc;padding-bottom:0.15rem;">
					<input type="text" v-model="name" placeholder="请输入姓名">
				</div>
				<div class="zz-title" v-if="alipay_accounts">
					当前支付宝账号：{{alipay_accounts}}
				</div>
				<div class="zz-title" v-else>
					当前支付宝账号：未添加
				</div>
				<div class="zz-title" style="border-bottom:1px solid #ccc;padding-bottom:0.15rem;">
					<input type="text" v-model="alipay_account" placeholder="请输入支付宝账号">
				</div>
				<div class="zz-button" @click="updateName">确认修改</div>
				<div class="public-progress" style="z-index:9;">
				<img src="../../icon/icon150x150.png" alt="" class="animated infinite flash" style="width:200px;height:200px;display:block;margin:200px auto;">
				</div>
			</div>
		</div>
	</body>
	<script src="../../script/api.js"></script>
	<script src="../../script/jquery.js"></script>
	<script src="../../script/mescroll.js"></script>
	<script src="../../script/vue.js"></script>
	<script src="../../script/app.js"></script>
	<script src="../../script/jsencrypt.js"></script>
	<script src="../../script/fastclick.js"></script>

	<script>
		var vm;
		var mescroll;
		var mySwiper;
		apiready = function() {
			api.removeLaunchView();
			setBar("statusbar");
			setFont(750);
			startVue();
			// NewMescroll();
			var top = $("#public-header").outerHeight(true) + $("#nav").outerHeight(true);
			$("#mescroll").css({
				"top": top + "px"
			});
			$(".public-progress").fadeOut(1000);
			setTimeout(function() {
				$(".public-progress").css({
					"display": "none"
				});
			}, 1000);
		}

		function startVue() {
			vm = new Vue({
				el: "#app",
				data: {
					name: '',
					names: '',
					wechat: api.pageParam.wechat,
					alipay_accounts: '',
					alipay_account: '',
				},
				created: function() {
					this.getAccount();
				},
				mounted: function() {},
				methods: {
					getAccount: function() {
						api.ajax({
							url: apiUrl + '/api/user/checkAccount',
							method: 'post',
							data: {
								values: {
									token: $api.getStorage('token'),
								},
							}
						}, function(ret, err) {
							console.log(JSON.stringify(ret));
							if (ret.code == 1) {
								vm.names = ret.data['alipay_name'];
								vm.alipay_accounts = ret.data['alipay_account'];
							} else {
								vm.names = '';
								vm.alipay_accounts = '';
							}
						});
					},
					updateName: function() {
						if (vm.alipay_account == "") {
							msg('请输入支付宝账号');
							return;
						}
						api.ajax({
							url: apiUrl + '/api/user/updateAccount',
							method: 'post',
							data: {
								values: {
									token: $api.getStorage('token'),
									alipay_name: vm.name,
									alipay_account: vm.alipay_account,
								},
							}
						}, function(ret, err) {
							if (ret.code == 1) {
								msg('修改成功');
								setTimeout(function() {
									api.closeToWin({
										name: 'root'
									});
									api.execScript({
										name: 'root',
										script: 'qhSelect(0);'
									});
								}, 1000)
							} else {
								msg(ret.msg);
							}
						});

					},

				}
			})
		}
	</script>
</html>
